---
import PageBanner from "../components/PageBanner.vue";
import Banner from "../components/Banner.vue";
import data from "virtual:json-conf";
import Layout from "../layouts/Layout.astro";

const { news } = data;

const { swiper, newsSwiper, text } = news || {
  swiper: [],
  newsSwiper: [],
  text: "",
};
---

<Layout>
  <div>
    {swiper?.map((item) => <Banner client:only="vue" banners={item} />)}
  </div>
  <div class="p-80px <lg:p-0">
    <div class="container m-auto">
      <div class="lg:mt-30px <lg:mt-16px">
        {
          newsSwiper?.map((newsBanners) => (
            <PageBanner banners={newsBanners} client:only="vue" />
          ))
        }
      </div>
      <div class="mt-30px <lg:px-16px <lg:mb-16px" set:html={text} />
    </div>
  </div>
</Layout>
